نگاهی به ناوبری در طراحی وب
دستگاه ها تغییر کرده اند.
نمایشگرهای کوچک همه جا هستند. آنها تقریباً در هر اندازه ای قابل تصور هستند. سیستم‌های ناوبری، درست مانند هر عنصر دیگر صفحه، باید با این وضعیت جدید سازگار شوند. با این حال، برای ناوبری کمی سخت تر است، زیرا "فقط انباشتن آن به صورت عمودی" همیشه کار نمی کند.
نتیجه ایجاد طیف گسترده ای از الگوهای ناوبری جدید است که به طور خاص برای موبایل طراحی شده اند و سایر الگوهای طراحی شده برای سازگاری با تمام اندازه های صفحه نمایش. آنها درجات مختلفی از موفقیت را کسب کرده اند.
3. کاربران ما و درک ما از کاربران، تغییر کرده است.
کامپیوترها دیگر تنها در اختیار علاقه مندان و افرادی نیستند که برای کار خود به کامپیوتر نیاز دارند.
سفارش ساخت سایت در فریلنس پروژه
تقریباً همه در کشورهای توسعه یافته به نوعی دسترسی به رایانه دارند، خواه کنسول، دسکتاپ قدیمی در کتابخانه یا تلفن همراهشان. تلفن های هوشمند به طور خاص در سراسر جهان گسترش یافته اند و تقریباً تنها وسیله اتصال به اینترنت در برخی مکان ها هستند.
در نتیجه، کاربران ما از افرادی که هنوز در استفاده از ماوس مشکل دارند تا افرادی که در فناوری متولد شده‌اند (و به دلایلی هنوز واقعاً از ماوس استفاده نکرده‌اند) متغیر هستند. همانطور که کاربران خود را بهتر درک کرده ایم، راه های بصری تری برای جابجایی وب سایت ایجاد کرده ایم. هدف ما این نیست که همه چیز در سایت را به یکباره به آنها نشان دهیم، بلکه این است که اطلاعاتی را که می خواهند، در زمانی که می خواهند به آنها نشان دهیم.
به‌عنوان مردی که عاشق رایانه‌های شخصی خود است، نمی‌خواهم این را اعتراف کنم، اما… اپل در این مورد کمک کرد. و در یک راه بزرگ. این ایده، این هدف که بتوانیم سیستم عامل را حداکثر با سه کلیک بچرخانیم، الهام بخش بسیاری از طراحان وب بود. ممکن است در همه موارد هنوز آنجا نباشیم، اما برخی از وب‌سایت‌ها و برنامه‌ها تقریباً به اندازه سیستم عامل متوسط ??شما پیچیده هستند.
الان کجا هستیم:
خوب، این قسمت با تصاویر زیبا است. بیایید به برخی از الگوهای ناوبری که امروز استفاده می کنیم نگاهی بیندازیم. برخی از آنها متعلق به دوران قدیم هستند که هنوز هم عالی کار می‌کنند، برخی دیگر کاملاً جدید هستند و برخی دیگر فقط تغییرات جزئی از الگوهای تثبیت‌شده هستند که متناسب با زمینه خود تنظیم شده‌اند.
1. ناوبری ساده
این الگوی ناوبری کلاسیک شماست. این لیستی از پیوندها است که در نزدیکی بالای صفحه قرار گرفته و به صورت افقی یا عمودی سازماندهی شده است. هیچ‌وقت از کار افتاد، لیست‌ها کوتاه‌تر شدند. این دسته همچنین شامل نوارهای ناوبری به سبک منو می شود.
این به دامنه سایت‌های کوچک‌تر، معمولاً سایت‌های بروشور و سایت‌های تجارت الکترونیک با موجودی کم منتقل شده است، زیرا معمولاً در آنجا بهترین کارایی دارد.
طراحی لوگو با بهترین طراحان لوگو در فریلنس پروژه
نمونه های دیگر:
مبارزه با اسباب بازی
باشگاه باحال
کالاهای قصیده
پیتر تایت
تک فونت ها
گال زننده
از خواب بیدار
2. ناوبری پنهان
این یک مصنوع از رویکرد اول موبایل ما به تقریباً همه چیز این روزها است. اغلب منطقی است که مسیریابی خود را پشت یک دکمه پنهان کنید. این الگو بر روی دسکتاپ نفوذ کرده است و برخی از طراحان تا آنجا پیش رفته اند که منوهای تمام صفحه برای پنج یا شش لینک ایجاد می کنند.
به نظر غیر ضروری به نظر می رسد، اما من فکر می کنم که وقتی تا آنجا پیش رفتید که ناوبری خود را پنهان کنید، بزرگ کردن منو به هیچ وجه به قابلیت استفاده آسیب نمی رساند.
در مورد Awwwards، پنهان کردن پیمایش منطقی است، زیرا آنها یک منوی فشرده (ish) پیچیده دارند که برای کار کردن به فضای نسبتاً مناسبی نیاز دارد.
Awwwards
نمونه های دیگر:
Mindsparkle Mag
Kinfolk
نورگرام
دنباله داستان
Gooqx
پل مل
فیل کازابون
3. ناوبری هیبریدی
فریلنس پروژه سایت دورکاری و فریلنسری
در سایت‌های بزرگتر، و مطمئناً در برنامه‌های وب، اغلب لازم است از بیش از یک شکل ناوبری استفاده کنید. مثال ساده این است که چگونه It"s Nice That دارای چند پیوند ناوبری اصلی در گوشه سمت چپ بالا است و لیست بسیار جامع تری از پیوندها را در پشت دکمه همبرگر پنهان می کند.
سایت های این دسته اغلب از ناوبری مبتنی بر پاورقی نیز استفاده زیادی می کنند. گاهی اوقات، این فقط تکرار آیتم های منو در بالای صفحه است و برای راحتی استفاده می شود. مواقع دیگر، پاورقی محل ناوبری ثانویه است، پر از پیوندهایی که برای تعداد کمتری از کاربران مفید است.
افرادی که می‌خواهند زبان سایت را تغییر دهند، برای کار درخواست دهند یا خط‌مشی‌های حفظ حریم خصوصی را برای سرگرمی مطالعه کنند (آیا واقعاً این کار را می‌کنند؟) ممکن است بخواهند از آنجا شروع کنند.
این خوب است
نمونه های دیگر:
Webydo
جوانان بزرگ
هانا پورمورت
چهارم و شگفتی
10*16
کار پا
اورلین ویگن
4. ناوبری مبتنی بر طبقه بندی
برو به هر وبلاگی نگاه کن یا سایت خبری یا پینترست اینجاست که این نوع ناوبری را خواهید یافت.
این همه در مورد بردن کاربران خود از طریق پست های طبقه بندی شده و سایر مجموعه های اطلاعات است. فرقی نمی‌کند بر اساس موضوع، تاریخ، برچسب‌ها یا آنچه که دارید طبقه‌بندی شود، همه چیز به شما کمک می‌کند تا محتوای مشابه بیشتری پیدا کنید.
24 راه
5. ناوبری تجربی
این یک الگوی طراحی خاص نیست، بلکه مجموعه ای از آنهاست. من دوست دارم نام آن را Portfolio Navigation بگذارم، زیرا این نوع از ناوبری بیشتر در سایت های نمونه کار استفاده می شود، جایی که طراحان احساس راحتی می کنند
xtra creative. اغلب با عدم وجود منوی سنتی، یا با پراکندگی آیتم های منو در سراسر صفحه مشخص می شود. گوشه ها نسبتاً محبوب هستند.
همچنین اغلب با یک رویکرد جاوا اسکریپت سنگین و با طعم بسیار ارائه برای چیدمان، با تعداد زیادی انیمیشن استفاده می شود. این رویکرد به ناوبری اغلب تا حدی به قابلیت استفاده آسیب می رساند، اما نمی توان انکار کرد که این اثر اغلب خلاقانه و جدید است.
یک خانه مشترک (آنتون و ایرنه)
نمونه های دیگر:
Veinti Dos Gradoes
دفن زباله صفر
اوبر راید
ساکن
شمال 2
زیرا
پس لرزه
ناوبری در آینده:
آینده نزدیک:
چه نوع ناوبری را می خواهید ببینید ساخته شده است؟ برو درست کن به غیر از آن، من فکر می‌کنم که مردم به کار بر روی اشکال ناوبری پاسخگو و غیرمجاز دستگاه ادامه خواهند داد، زیرا مجبورند. ایده اندازه صفحه نمایش استاندارد مدت ها پیش مرده بود.
من فکر می‌کنم مردم متوجه خواهند شد که راه‌حل‌های ناوبری برای اندازه‌های دسکتاپ و موبایل با هر طراحی ممکن است به‌خصوص در وب‌سایت‌های بزرگ، کاملاً متفاوت باشند. بنابراین، برای مثال، یک منوی کشویی ممکن است بعداً به یک منوی آموزشی تبدیل شود، یا به چیز دیگری که بهتر در یک صفحه نمایش کوچک قرار می گیرد.
الکس دروت برای کیک پوش
من فکر می کنم که اعتقاد مردم به واقعیت مجازی برخی از الگوهای طراحی ما را نیز تغییر خواهد داد. توجه داشته باشید، من فکر نمی‌کنم VR به تنهایی کار زیادی انجام دهد. این سیستمی است که شما را کم و بیش نسبت به دنیای بیرون کور می کند و دقیقاً متحرک نیست. برای اینکه VR از کار بیفتد، باید با توده‌ها حرکت کند، و بیشتر آنها آدم‌هایی نیستند که خارج از دفاترشان زندگی کنند یا دفترشان در خانه باشد.
اما، حداقل برای مدتی، افرادی که واقعاً می‌خواهند واقعیت مجازی چیز بزرگ بعدی باشد، بر نحوه طراحی سایت‌ها تأثیر می‌گذارند و این لزوماً چیز بدی نیست.
آینده قابل پیش بینی کم و بیش:
واقعیت افزوده است که برای اکثر مردم کمی دلپذیرتر (و قابل استفاده) است. با استقبال وحشتناک Google Glass شروع بسیار دشواری داشت. با این حال، در اشکال عمومی‌تر آن مانند پوکمون گو، دیوانه‌وار به راه افتاد. (اگرچه حتی در آن زمان، ما شاهد برخی از هیستری های مرتبط با PGo بودیم.) با توجه به زمان برای سازگاری مردم، ممکن است شروع به دیدن دستگاه های اختصاصی AR کنیم که مردم را از رستوران ها بیرون نمی کنند.
دیلوشن
چیز دیگری که همیشه بزرگتر می شود اتوماسیون است. خانه‌های خودکار، ماشین‌های خودران و به‌طور فزاینده‌ای، دستگاه‌های ما برای تعامل با آنها نیازی به لمس آنها ندارند.
این امر بر روی ناوبری وب سایت تأثیر زیادی خواهد گذاشت، زیرا در حال حاضر، هنوز هم بیشتر به کلیک کردن با ماوس یا ضربه زدن با انگشت افراد بستگی دارد. این با گذشت زمان تغییر خواهد کرد.
همانطور که دستیارهای مجازی مانند سیری و کورتانا بیش از پیش باهوش تر و توانمندتر می شوند، افراد دلایل کمتری برای تعامل فیزیکی با دستگاه های خود برای دسترسی به اطلاعات و برقراری ارتباط با دیگران پیدا می کنند. ما در حال حاضر سیستم های فرمان صوتی ابتدایی برای بسیاری از چیزها در حال حاضر داریم، و من فکر می کنم که آنها فقط پیچیده تر خواهند شد.
اکنون، این روشی نیست که همه با دستگاه‌های خود ارتباط برقرار می‌کنند، اما من شدیداً گمان می‌کنم که در آینده، ناوبری وب‌سایت باید حداقل به اندازه انسان‌پسند بودن ماشین باشد. اکنون چالشی وجود دارد که باید سرگرم کننده باشد.
به نظر شما آینده چه چیزی در انتظار شماست؟ آیا در سال 2022 شاهد ادغام چارچوب های ناوبری موجود یا انفجار الگوهای جدید در طراحی وب خواهیم بود؟
نویسنده
ازکیل برونی
یک طراح UX، نویسنده و عکاس مشتاق است که در مکزیک زندگی می کند. وقتی در قاب سیمی یا کد جلویی گوش‌های ریز تراشیده‌اش را ندارد، تاکوهای دل‌انگیزی درست می‌کند. او را در توییتر فریاد بزنید..